<template>
  <div>
    <a-card :bordered="false">
      <div v-if="isShow">
        <a-table
          :columns="columnstableKAITONG"
          :data-source="dataKAITONG"
          bordered
          size="middle"
          rowKey="id"
          style="margin: 20px 10% 0 10%"
          :pagination="false"
        >
          <template slot="file" slot-scope="text, record">
            <SelectFile
              :includeFileName="record.desc"
              :id="record.id"
              @fileListChange="fileListChange"
              @resultChange="resultChange"
            ></SelectFile>
          </template>
          <template slot="action" slot-scope="text, record">
            <UpoadFile
              @resultChange="resultChange"
              :uploadIsOk="record.uploadIsOk"
              :id="record.id"
              :url="record.url"
              :fileList="record.fileList"
              :btninfo="record"
              @btnChange="btnChange"
            ></UpoadFile>
          </template>
          <template slot="template" slot-scope="text, record">
            <a :href="record.downurl" :download="record.downurl">点击下载</a>
          </template>
        </a-table>
        <UploadFileAll
          style="margin: 20px 10% 0 10%;float:right"
          @resultChange="resultChange"
          @btnloading="btnloading"
          :info="dataKAITONG"
        ></UploadFileAll>
        <!-- <a-button type="primary" style="width:10%;margin:20px 45%" @click="daoru">查看总报表</a-button> -->
        <div style="height:1000px"></div>
      </div>
      <!-- //页面总报表 -->
      <div style="margin: 5px 10px" v-else>
        <a-button v-if="tableInfo == 1" style="margin-bottom:5px" shape="round" type="primary" @click="comeBack"
          >返回</a-button
        >
        <br />
        <a-range-picker
          @change="onChangePicker"
          :default-value="[moment(startTime, dateFormat), moment(endTime, dateFormat)]"
          :format="dateFormat"
        />
        <a-button type="primary" icon="search" style="margin:  10px 0 10px 10px" @click="searchFirst">查询</a-button>
        <a-button type="primary" icon="export" style="margin:  10px 0 10px 10px" @click="downloadQK"
          >excel导出</a-button
        >

        <!-- 启航分析表格 -->
        <a-table
          :loading="firstLoading"
          v-if="analisyType"
          :columns="columnstableFirst"
          :data-source="dataFirst"
          bordered
          size="middle"
          style="width:100%"
          :pagination="false"
        />
        <!-- 企宽分析表格 -->
        <a-table
          v-else
          :loading="secondLoading"
          :columns="columnstableFirstNext"
          :data-source="dataFirstNext"
          bordered
          size="middle"
          style="width:100%"
          :pagination="false"
        />
      </div>
    </a-card>
  </div>
</template>

<script>
import moment from 'moment'
import { getFXQK, exportExcelQK } from '@/api/public'
import { getNowFormatDate } from '@/utils/util.js'
import Vue from 'vue'
import SelectFile from '@/views/systemManage/uploadFile/selectFile'
import UpoadFile from '@/views/systemManage/uploadFile/upoadFile'
import UploadFileAll from '@/views/systemManage/uploadFile/uploadFileAll'
export default {
  name: 'TableList',
  components: {
    SelectFile,
    UpoadFile,
    UploadFileAll
  },
  props: ['tableInfo'],
  data() {
    this.columns = columns
    return {
      qingdanlist: [],
      firstLoading: false,
      secondLoading: false,
      startTime: '',
      endTime: '',
      dateFormat: 'YYYY-MM-DD',
      fileList: '',
      analisyType: false,
      linshiId: '', //记录修改得某行清单id
      isShow: true,
      readDetailInfo: false, //二级页面（一级详情）
      daochuIs: false,
      headers: {
        authorization: Vue.ls.get('ACCESS_TOKEN')
      },
      columnstableERJI,
      columnstableYIJI,
      columnstable,
      columnstableKAITONG, //KT
      columnstableFirst,
      columnstableFirstNext,
      data,
      dataFirst: [],
      dataFirstNext: [],
      dataKAITONG: [],
      searchData: [],
      visible: false,
      confirmLoading: false,
      mdl: null,
      advanced: false,
      queryParam: {},
      selectedRowKeys: [],
      selectedRows: [],
      uidList: []
    }
  },
  filters: {},
  created() {
    this.startTime = getNowFormatDate()
    this.endTime = getNowFormatDate()
    this.initdataKAITONG()
  },
  computed: {},
  mounted() {
    if (this.tableInfo == 2) {
      this.isShow = false
      this.getSecondtData()
    }
  },
  methods: {
    moment,
    //上传结果按钮状态改变
    btnloading(id) {
      this.dataKAITONG[id].loading = true
    },
    //按钮状态改变
    btnChange(id) {
      this.dataKAITONG[id].loading = true
    },
    //上传文件
    fileListChange(fileList, result, id) {
      result == '文件名称错误' ? (this.dataKAITONG[id].uploadIsOk = true) : (this.dataKAITONG[id].uploadIsOk = false)
      this.dataKAITONG[id].fileList = fileList
      this.dataKAITONG[id].status = result
    },
    //删除结果改变
    resultChange(data, id) {
      this.dataKAITONG[id].status = data
      this.dataKAITONG[id].fileList = []
      this.dataKAITONG[id].uploadIsOk = true
      this.dataKAITONG[id].loading = false
    },
    //查询
    searchFirst() {
      this.getSecondtData()
    },

    ////获取 企宽分析周报
    getSecondtData() {
      this.secondLoading = true
      getFXQK(this.startTime, this.endTime)
        .then(response => {
          this.dataFirstNext = response.data
          this.dataFirstNext.forEach((item, index) => {
            this.dataFirstNext[index].id = index
          })
          this.secondLoading = false
        })
        .catch(error => {
          this.secondLoading = false
        })
    },
    //export导出-企宽 分析 2
    downloadQK() {
      exportExcelQK(this.startTime, this.endTime)
        .then(response => {
          let blob = new Blob([response], { type: 'application/vnd.ms-excel;charset=utf-8' })
          let url = window.URL.createObjectURL(blob)
          let aLink = document.createElement('a')
          aLink.style.display = 'none'
          aLink.href = url
          aLink.setAttribute('download', 'QKExcel.xlsx')
          document.body.appendChild(aLink)
          aLink.click()
          document.body.removeChild(aLink)
          window.URL.revokeObjectURL(url)
          this.$message.success(`文件已导出`)
        })
        .catch(error => {})
    },

    //
    onChangePicker(date, dateString) {
      this.startTime = dateString[0] + ' 00:00:00'
      this.endTime = dateString[1] + ' 23:59:59'
    },

    //查看报表
    daoru() {
      this.isShow = false
      this.startTime = getNowFormatDate() + ' 00:00:00'
      this.endTime = getNowFormatDate() + ' 23:59:59'
      this.getSecondtData()
    },
    //初始化清单列表数据
    initdataKAITONG() {
      this.dataKAITONG = [
        {
          id: 0,
          name: '当前在途',
          url: '/api/import/manage/qk_install',
          fileList: [],
          status: '未上传',
          desc: '当前在途',
          uploadIsOk: false,
          rule: 'xx当前在途xx.xlsx',
          loading: false,
          downurl: 'http://gangmao.oss-cn-shenzhen.aliyuncs.com/fzydd/excel/%E8%B4%A6%E6%88%B7%E6%A8%A1%E6%9D%BF.xlsx'
        },
        {
          id: 1,
          name: '装机及时率',
          url: '/api/import/manage/qk_rate',
          fileList: [],
          status: '未上传',
          desc: '装机及时率',
          uploadIsOk: false,
          rule: 'xx装机及时率xx.xlsx',
          loading: false,
          downurl: 'http://gangmao.oss-cn-shenzhen.aliyuncs.com/fzydd/excel/%E8%B4%A6%E6%88%B7%E6%A8%A1%E6%9D%BF.xlsx'
        },
        {
          id: 2,
          name: '企宽满意度(省调)',
          url: '/api/import/manage/qk_satisfied',
          fileList: [],
          status: '未上传',
          desc: '企宽满意度',
          uploadIsOk: false,
          rule: 'xx企宽满意度xx.xlsx',
          loading: false,
          downurl: 'http://gangmao.oss-cn-shenzhen.aliyuncs.com/fzydd/excel/%E8%B4%A6%E6%88%B7%E6%A8%A1%E6%9D%BF.xlsx'
        },
        {
          id: 3,
          name: '企宽投诉',
          url: '/api/import/manage/qk_complain',
          fileList: [],
          status: '未上传',
          desc: '企宽投诉',
          uploadIsOk: false,
          rule: 'xx企宽投诉xx.xlsx',
          loading: false,
          downurl: 'http://gangmao.oss-cn-shenzhen.aliyuncs.com/fzydd/excel/%E8%B4%A6%E6%88%B7%E6%A8%A1%E6%9D%BF.xlsx'
        },
        {
          id: 4,
          name: '当日受理',
          url: '/api/import/manage/qk_install_last',
          fileList: [],
          status: '未上传',
          desc: '当日受理',
          uploadIsOk: false,
          rule: 'xx当日受理xx.xlsx',
          loading: false,
          downurl: 'http://gangmao.oss-cn-shenzhen.aliyuncs.com/fzydd/excel/%E8%B4%A6%E6%88%B7%E6%A8%A1%E6%9D%BF.xlsx'
        }
      ]
    },
    readDetail() {
      this.readDetailInfo = true
    },
    callback() {},
    comeBack() {
      this.isShow = true
      this.initdataKAITONG()
    },
    daocru() {
      this.isShow = false
    }
  }
}

const columnstableKAITONG = [
  {
    title: '报表类型', //Excel清单名称
    dataIndex: 'name',
    key: 'name',
    width: 50,
    align: 'center',
    scopedSlots: { customRender: 'name' }
  },
  {
    title: '命名规则',
    dataIndex: 'rule',
    key: 'rule',
    width: 50,
    align: 'center'
  },
  {
    title: '上传操作',
    dataIndex: 'file',
    key: 'file',
    width: 100,
    align: 'center',
    scopedSlots: { customRender: 'file' }
  },
  {
    title: '上传结果',
    dataIndex: 'status',
    key: 'status',
    width: 50,

    align: 'center',
    scopedSlots: { customRender: 'status' }
  },
  {
    title: '模板下载',
    dataIndex: 'template',
    key: 'template',
    width: 50,
    align: 'center',
    scopedSlots: { customRender: 'template' }
  },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action',
    width: 50,
    ellipsis: true,
    align: 'center',
    scopedSlots: { customRender: 'action' }
  }
]

const columnstable = [
  {
    title: '区县',
    dataIndex: 'name',
    key: 'name',
    width: 100,
    align: 'center'
  },
  {
    title: '集团专线',
    children: [
      {
        title: '快开占比',
        children: [
          {
            title: '总量',
            dataIndex: 'street',
            key: 'street',
            width: 100,
            align: 'center'
          },
          {
            title: '占比',
            dataIndex: 'streets',
            key: 'streets',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '1日快开',
        children: [
          {
            title: '总量',
            dataIndex: 'zongliang',
            key: 'zongliang',
            width: 100,
            align: 'center'
          },
          {
            title: '平均时长',
            dataIndex: 'shihcang',
            key: 'shihcang',
            width: 100,
            align: 'center'
          },
          {
            title: '回单',
            dataIndex: 'huidan',
            key: 'huidan',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '2日查勘',
        children: [
          {
            title: '总量',
            dataIndex: 'zonglianga',
            key: 'zonglianga',
            width: 100,
            align: 'center'
          },
          {
            title: '平均时长',
            dataIndex: 'shihcanga',
            key: 'shihcanga',
            width: 100,
            align: 'center'
          },
          {
            title: '接单',
            dataIndex: 'jiedana',
            key: 'jiedana',
            width: 100,
            align: 'center'
          },
          {
            title: '回单',
            dataIndex: 'huidana',
            key: 'huidana',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '3日快建',
        children: [
          {
            title: '总量',
            dataIndex: 'zongliangb',
            key: 'zongliangb',
            width: 100,
            align: 'center'
          },
          {
            title: '平均时长',
            dataIndex: 'shihcangb',
            key: 'shihcangb',
            width: 100,
            align: 'center'
          },
          {
            title: '接单',
            dataIndex: 'jiedanb',
            key: 'jiedanb',
            width: 100,
            align: 'center'
          },
          {
            title: '回单',
            dataIndex: 'huidanb',
            key: 'huidanb',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '端到端',
        children: [
          {
            title: '及时率',
            dataIndex: 'zongliangc',
            key: 'zongliangc',
            width: 100,
            align: 'center'
          }
        ]
      }
    ]
  },

  {
    title: '企宽',
    dataIndex: 'gender',
    key: 'gender',
    children: [
      {
        title: '总量',
        dataIndex: 'zongliangdd',
        key: 'zongliangdd',
        width: 100,
        align: 'center'
      },
      {
        title: '首约',
        dataIndex: 'shouyeue',
        key: 'shouyeue',
        width: 100,
        align: 'center'
      },
      {
        title: '总量',
        dataIndex: '竣工',
        key: 'jungong',
        width: 100,
        align: 'center'
      }
    ]
  }
]

const columnstableERJI = [
  {
    title: '区县',
    dataIndex: 'name',
    key: 'name',
    width: 100,
    align: 'center'
  },
  {
    title: '集团专线',
    children: [
      {
        title: '1日快开及时率',
        children: [
          {
            title: '平均时长',
            dataIndex: 'zongliang',
            key: 'zongliang',
            width: 100,
            align: 'center'
          },
          {
            title: '回单(%)',
            dataIndex: 'shihcang',
            key: 'shihcang',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '2日查勘及时率',
        children: [
          {
            title: '平均时长',
            dataIndex: 'zonglianga',
            key: 'zonglianga',
            width: 100,
            align: 'center'
          },
          {
            title: '接单(%)',
            dataIndex: 'shihcanga',
            key: 'shihcanga',
            width: 100,
            align: 'center'
          },
          {
            title: '回单(%)',
            dataIndex: 'jiedana',
            key: 'jiedana',
            width: 100,
            align: 'center'
          },
          {
            title: '回单',
            dataIndex: 'huidana',
            key: 'huidana',
            width: 100,
            align: 'center'
          }
        ]
      },
      {
        title: '3日快建及时率',
        children: [
          {
            title: '平均时长',
            dataIndex: 'zongliangb',
            key: 'zongliangb',
            width: 100,
            align: 'center'
          },
          {
            title: '接单(%)',
            dataIndex: 'shihcangb',
            key: 'shihcangb',
            width: 100,
            align: 'center'
          },
          {
            title: '回单(%)',
            dataIndex: 'jiedanb',
            key: 'jiedanb',
            width: 100,
            align: 'center'
          }
        ]
      }
    ]
  },

  {
    title: '企宽',
    dataIndex: 'gender',
    key: 'gender',
    align: 'center',
    children: [
      {
        title: '及时率(%)',
        dataIndex: 'zongliangdd',
        key: 'zongliangdd',
        width: 100,
        align: 'center'
      }
    ]
  }
]
const columnstableYIJI = [
  {
    title: '区县',
    dataIndex: 'name',
    key: 'name',
    width: 100,
    align: 'center'
  },
  {
    title: '开通及时率（%）',
    dataIndex: 'gender',
    key: 'gender',
    children: [
      {
        title: '1日快开',
        dataIndex: 'zongliangdd',
        key: 'zongliangdd',
        width: 100,
        align: 'center'
      },
      {
        title: '2日查勘',
        dataIndex: 'shouyeue',
        key: 'shouyeue',
        width: 100,
        align: 'center'
      },
      {
        title: '3日快建',
        dataIndex: '竣工2',
        key: 'jungong2',
        width: 100,
        align: 'center'
      },
      {
        title: '端到端',
        dataIndex: '竣工3',
        key: 'jungong3',
        width: 100,
        align: 'center'
      },
      {
        title: '企宽',
        dataIndex: '竣工4',
        key: 'jungong4',
        width: 100,
        align: 'center'
      }
    ]
  },
  {
    title: '操作',
    dataIndex: 'actionD',
    key: 'actionD',
    width: 100,
    align: 'center',
    scopedSlots: { customRender: 'actionD' }
  }
]
const columnstableFirstNext = [
  {
    title: '综合及时率报表',
    children: [
      {
        title: '地市ID',
        dataIndex: 'id',
        key: 'id',
        width: 80,
        align: 'center'
      },
      {
        title: '区域',
        dataIndex: 'area',
        key: 'area',
        width: 80,
        align: 'center'
      },
      {
        title: '竣工量',
        dataIndex: 'overNum',
        key: 'overNum',
        width: 80,
        align: 'center'
      },
      {
        title: '及时率（刚性）',
        dataIndex: 'gxRatio',
        key: 'gxRatio',
        width: 80,
        align: 'center'
      },
      {
        title: '及时率（剔除）',
        dataIndex: 'tcRatio',
        key: 'tcRatio',
        width: 100,
        align: 'center'
      },
      {
        title: '首约完成率',
        dataIndex: 'firstRatio',
        key: 'firstRatio',
        width: 80,
        align: 'center'
      }
    ]
  }
]
const columnstableFirst = [
  {
    title: '故障数据周报',
    children: [
      {
        title: '区县',
        dataIndex: 'area',
        key: 'area',
        width: 80,
        align: 'center'
      },
      {
        title: '竣工总量',
        dataIndex: 'completeTotal',
        key: 'completeTotal',
        width: 80,
        align: 'center'
      },
      {
        title: '快建总量',
        dataIndex: 'buildTotal',
        key: 'buildTotal',
        width: 80,
        align: 'center'
      },
      {
        title: '快开总量',
        dataIndex: 'startTotal',
        key: 'startTotal',
        width: 80,
        align: 'center'
      },
      {
        title: '快开占比',
        dataIndex: 'startRatio',
        key: 'startRatio',
        width: 100,
        align: 'center'
      },
      {
        title: '查勘总量',
        dataIndex: 'surveyTotal',
        key: 'surveyTotal',
        width: 80,
        align: 'center'
      },
      {
        title: '快建平均时长',
        dataIndex: 'buildTime',
        key: 'buildTime',
        width: 100,
        align: 'center'
      },
      {
        title: '快建及时率',
        dataIndex: 'buildRatio',
        key: 'buildRatio',
        width: 100,
        align: 'center'
      },
      {
        title: '快开平均时长',
        dataIndex: 'startTime',
        key: 'startTime',
        width: 100,
        align: 'center'
      },
      {
        title: '快开及时率',
        dataIndex: 'startTimeOne',
        key: 'startTimeOne',
        width: 100,
        align: 'center'
      },
      {
        title: '查勘平均时长',
        dataIndex: 'surveyTime',
        key: 'surveyTime',
        width: 100,
        align: 'center'
      },
      {
        title: '查勘及时率',
        dataIndex: 'surveyRatioTwo',
        key: 'surveyRatioTwo',
        width: 100,
        align: 'center'
      },
      {
        title: '综资量',
        dataIndex: 'gather',
        key: 'gather',
        width: 80,
        align: 'center'
      },
      {
        title: '查勘接单及时率',
        dataIndex: 'surveyRatio',
        key: 'surveyRatio',
        width: 100,
        align: 'center'
      },
      {
        title: '开通接单及时率',
        dataIndex: 'openRatio',
        key: 'openRatio',
        width: 100,
        align: 'center'
      }
    ]
  }
]
const data = []
const columns = []
</script>
